import React from 'react';
import Loadable from 'react-loadable';

// import Official from '@/views/official'
// import Img from '@/views/img'
// import Car from '@/views/car'
// import Quotation from '@/views/quotation'

//函数：1》函数的参数  2》函数的功能  3.函数返回值  4.函数核实调用

//路由懒加载  实现原理
// function loadable({load}){
//     console.log("34567890346789")
//     return class extends Component{
//         state = {
//             Com:null
//         }

//         componentDidMount(){
//             console.log("========",window.location.pathname)
//             load().then(res => {
//                 console.log(res.default)
//                 this.setState({
//                     Com:res.default
//                 })
//             })
//         }

//         render(){
//             let {Com} = this.state;
//             return Com ? <Com {...this.props}/> : <div>loading....</div>
//         }
//     }
// }

function Loading(){
    return <div>loading....</div>
}

const routes = [
    {
        path:'/',
        redirect:'/official'
    },
    {
        path:'/official',
        component:Loadable({
            loader:() => import('@/views/official'),
            loading:Loading
        })  //component 必须是一个组件
    },
    {
        path:'/img/:SerialID',
        component:Loadable({
            loader:() => import('@/views/img'),
            loading:Loading
        })
    },
    {
        path:'/car/:id',
        component:Loadable({
            loader:() => import('@/views/car'),
            loading:Loading
        })
    },
    {
        path:'/quotation',
        component:Loadable({
            loader:() => import('@/views/quotation'),
            loading:Loading
        })
    }
];

export default routes